<template>
    <el-dialog v-model="visible" title=产品审核 :close-on-click-modal="false" style="width: 30%;top:12%;"
        :close-on-press-escape="false">
        <el-form :model="dataForm" ref="dataFormRef" @keyup.enter="dataFormSubmitHandle()" label-width="120px">
            <el-form-item label="审核结果">
                <el-radio-group v-model="dataForm.audit">
                    <el-radio :label="1">审核通过</el-radio>
                    <el-radio :label="2">审核驳回</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item v-if="dataForm.audit === 2" label="驳回原因" prop="rejectReason">
                <el-input v-model="dataForm.auditRemark" type="textarea" :rows="3" placeholder="请输入驳回原因" />
            </el-form-item>
        </el-form>
        <template v-slot:footer>
            <el-button @click=" cancel" class="quxiao">{{ $t("cancel") }}</el-button>
            <el-button type="primary" @click="dataFormSubmitHandle()">{{ $t("confirm") }}</el-button>
        </template>
    </el-dialog>
</template>

<script lang="ts" setup>
import { reactive, ref, nextTick, computed, toRefs } from "vue";
import baseService from "@/service/baseService";
import { useI18n } from "vue-i18n";
import { ElMessage } from "element-plus";
import { getToken } from "@/utils/cache";
import app from "@/constants/app";
import { IObject } from "@/types/interface";
import { useRoute, useRouter } from 'vue-router';
import useView from "@/hooks/useView";

const { t } = useI18n();
const emit = defineEmits(["auditSuccess"]);
const visible = ref(false);
const dataFormRef = ref();
const dataForm = reactive({
    id: "",
    audit: 1,         // 1 通过  2 驳回
    auditRemark: ''    // 不通过原因

});
const router = useRouter();
const cancel = () => {
     visible.value = false;
};


/** 打开弹窗 */
const init = (id: string) => {
  visible.value = true;
  dataForm.id = id;
  console.log(dataForm.id);
  dataForm.audit = 1;
  dataForm.auditRemark = '';
  nextTick(() => dataFormRef.value?.resetFields());
}
/** 提交审核 */
const dataFormSubmitHandle = () => {
  dataFormRef.value?.validate((valid: boolean) => {
    if (!valid) return

    // 如果是通过，清空原因
    if (dataForm.audit === 1) {
      dataForm.auditRemark = "";
    }
    // 如果是不通过，判断原因是否为空
    if (dataForm.audit === 2) {
      if (!dataForm.auditRemark) {
        ElMessage.error("请输入审核不通过理由");
        return;
      }
    }

    baseService.post('/noc/productseries/audit', {
      id: dataForm.id,
      audit: dataForm.audit,
      auditRemark: dataForm.auditRemark
    }).then((res) => {
      if (res?.code === 0) {
       visible.value = false
       ElMessage.success(t('prompt.success'))
       emit('auditSuccess') 
      } else {
        ElMessage.error(res?.msg || '操作失败')
      }
    })
  })
}
const view = reactive({});
const state = reactive({ ...useView(view), ...toRefs(view) });
defineExpose({ init })
</script>

<style scoped lang="scss">
.quxiao {
    border-radius: 5px;
    background: rgba(239, 244, 255, 1);
    color: rgba(22, 119, 255, 1);
    border: 1px solid rgba(22, 119, 255, 1);
}

</style>
